<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>登录日志</title>
</head>
    <link rel="stylesheet" href="/layui/css/layui.css">
    <script src="/layui/layui.js"></script>
    <script src="/jquery/jquery-3.2.1.min.js"></script>
<style>
    #box{
        width:100%;
        height: 60px;
        margin-right: 200px;
        border-bottom: 1px solid #E4E4E4;
    }
    #box p{
        line-height: 60px;
        border-bottom: 1px solid #E4E4E4;
    }
    #bigBox{
        width:92%;
        margin:0 auto;
        margin-left: 30px;
    }
</style>
<body>

    <div id="bigBox">
        <div id="box">
            <p>登录日志</p>
            <div id="test"></div>
        </div>
    </div>
<script>
    layui.use(['table','jquery'],function () {
        var jquery = layui.jquery;
        var table = layui.table;
        $.ajax({
            url:'/LoginRecord/getLoginRecordTable',
            methos:'post',
            dataType:'json',
            success:function(data){
                tab(data);
                console.log(data.data);
            }

        })
        //表格渲染
        function tab(data) {
            table.render({
                elem:'#test',
                data:data.data,
                page:true,
                cols:
                    [[
                        {field:'loginDate',title:'登陆时间',align:'center'},
                        {field:'loginIp',title:'登陆IP',align:'center'},
                        {field:'loginAddress',title:'登陆地区',align:'center'},
                    ]]
            })
        }
    })
</script>
</body>
</html>